<script setup lang="ts">
const formData = reactive({
  mobile: '',
  password: '',
})
const formRef = ref()
function handleSubmit() {
  formRef.value
    .validate()
    .then(({ valid, errors }) => {
      if (valid) {

      }
    })
    .catch((error) => {
      console.log(error, 'error')
    })
}
</script>

<template>
  <view class="min-h-screen">
    <wd-form ref="formRef" :model="formData">
      <wd-cell-group border>
        <wd-input
          v-model="formData.mobile"
          label="用户名"
          label-width="100px"
          prop="value1"
          clearable
          placeholder="请输入用户名"
          :rules="[{ required: true, message: '请填写用户名' }]"
        />
        <wd-input
          v-model="formData.password"
          label="密码"
          label-width="100px"
          prop="value2"
          show-password
          clearable
          placeholder="请输入密码"
          :rules="[{ required: true, message: '请填写密码' }]"
        />
      </wd-cell-group>
    </wd-form>
    <wd-button @click="handleSubmit">
      登陆
    </wd-button>
  </view>
</template>

<route lang="json">
{
  "style": {
    "navigationBarTitleText": "登陆"
  }
}
</route>
